<template>
	<div class="wy-main business-manage">
		<a-row class="wy-main-title">
			<a-col :span="24">
				<p class="title-p">
					<a-divider class="title-vertical"  type="vertical" />
					<span class="title-span" >管理我的货源</span>
					<a-divider class="title-divider"  />
				</p>
			</a-col>
		</a-row>
		<div>
			<a-input v-model="cargoTitle" placeholder="请输入货物名称" class="wy-w-200" />
			<a-button type="primary" class="wy-m-l-10" @click="getSupplyInfo">点击查询</a-button>
			<a-button class="wy-m-l-10" @click="reset">重置信息</a-button>
			<router-link to="/business/supply/publish">
				<a-button type="primary" class="wy-m-l-10 wy-float-r"  v-hasPermission="'supply:add'">新增货源</a-button>
			</router-link>
			<a-button type="primary" class="wy-m-l-10 wy-float-r" v-hasPermission="'supply:add2'" @click="$refs.autoError.handleShow()">新增货源</a-button>
		</div>
		<a-table class="wy-m-t-20" :columns="columns" :rowKey="record => record.cargoId" :dataSource="data" :pagination="pagination" @change="handleTableChange" :loading="loading" :rowSelection="{selectedRowKeys: selectedRowKeys, onChange: onSelectChange}">
			<span slot="createTime" slot-scope="text, record">
				{{record.createTime&&record.createTime.split(' ')[0]}}
			</span>
     <span slot="approvalStatus" slot-scope="text, record">
      <span class="wei_warning" v-if="record.approvalStatus==106">待审核</span>
      <span class="wei_primary" v-if="record.approvalStatus==107">审核通过</span>
      <span class="wei_danger" v-if="record.approvalStatus==108">审核失败</span>
    </span>
			<span slot="action" slot-scope="text, record">
		      <a href="javascript:;" @click="seeInfo(record)">查看</a>
		      <a-divider type="vertical" v-if="record.approvalStatus == '108'" />
		      <a href="javascript:;" @click="edit(record)" v-if="record.approvalStatus == '108'"> 修改</a>
		      <a-divider type="vertical" />
		      <a @click="delSupply([record.cargoId])">删除</a>
		    </span>
		</a-table>
		<div style='margin-top: -55px;'>
			<a-button @click="delVehicles">删除所选</a-button>
		</div>
		<a-modal title="编辑信息" :visible="visible" @cancel="handleCancel" width="1000px" :maskClosable='false' :footer="null"  >
			<PublishForm v-if="visible" :isSee="isSee" :supplyType="supplyType" :type="type" :detail="detail" @handleCancel="editHandleCancel"></PublishForm>
		</a-modal>
		<!--未认证弹窗-->
		<auto-error  ref="autoError" ></auto-error>
	</div>
</template>
<script>
	import PublishForm from './components/PublishForm'
	import AutoError from '@/components/dialog/AutoError'
	
	const columns = [{
			title: '货物名称',
			dataIndex: 'cargoTitle',
			width: 120
		},
		{
			title: '出发地',
			dataIndex: 'beginPlace',
			scopedSlots: {
				customRender: 'beginPlace'
			},
			width: 150
		},
		{
			title: '到达地',
			dataIndex: 'endPlace',
			scopedSlots: {
				customRender: 'endPlace'
			},
			width: 150
		},
		{
			title: '发货人',
			dataIndex: 'sendPerson',
			width: 120
		},
		{
			title: '发货日期',
			dataIndex: 'createTime',
			scopedSlots: {
				customRender: 'createTime'
			},
			width: 120
		},
		{
			title: '浏览量',
			dataIndex: 'lookNums',
			width: 100
		},{
			title: '审核状态',
			dataIndex: 'approvalStatusValue',
			key:'approvalStatusValue',
			width:100,
			scopedSlots: {
				customRender: 'approvalStatus'
			},
		},
		{
			title: '操作',
			key: 'action',
			scopedSlots: {
				customRender: 'action'
			},
			width: 140
		}
	];
	export default {
		data() {
			return {
				isSee:true,
				type:'',	//操作类型
				supplyType: '', // 货源类型
				detail: {},
				visible: false,
				data: [],
				columns,
				loading: false,
				cargoTitle: '',
				pagination: {
					pageSizeOptions: ['10', '20', '30', '40', '100'],
					defaultCurrent: 1,
					defaultPageSize: 10,
					showSizeChanger: true,
					total:10,
					showTotal: (total, range) => `共 ${total} 条记录`
				},
				selectedRowKeys: [],
			}
		},
		computed: {},
		beforeCreate() {},
		created() {
			this.getSupplyInfo()
		},
		components: {
			PublishForm,
			AutoError
		},
		watch: {},

		mounted: function() {

		},
		methods: {
			// 关闭弹窗
			handleCancel(e) {
				this.visible = false
			},
			// 修改回调关闭
			editHandleCancel (e){
				this.getSupplyInfo();
				this.handleCancel();
			},
			// 取消按钮
			cancleShowModal() {
				this.visible = false
			},
			// 重置
			reset () {
				this.pagination.defaultCurrent = 1;
				this.cargoTitle = '';
				this.getSupplyInfo();
			},
			// 查看货物信息
			seeInfo(data){
				this.type = 'find'
				this.supplyType = data.type
				this.detail = data
				this.visible = true
				this.isSee = true
			},
			// 编辑货物信息
			edit(data){
				this.type = 'edit'
				this.supplyType = data.type
				this.detail = data
				this.visible = true
				this.isSee = false
			},
			// 选择事件
		    onSelectChange (selectedRowKeys) {
		      this.selectedRowKeys = selectedRowKeys
		    },
			// 删除多条信息
			delVehicles(){
				if (!this.selectedRowKeys.length) {
				  this.$message.warning('请选择需要删除的记录')
				  return
				}
			    let ids = this.selectedRowKeys
//			    for (let key of this.selectedRowKeys) {
//			      ids.push(this.data[key].cargoId)
//			    }
				this.delSupply(ids);
			},
			// 删除货源信息
			delSupply(arr) {
				let that = this
				this.$confirm({
					title: '确定删除所选中的记录?',
					content: '当您点击确定按钮后，这些记录将会被彻底删除',
					centered: true,
					onOk() {
						that.$delete('/info/infoCargomaster/' + String(arr)).then(() => {
							that.$message.success('删除成功')
							that.getSupplyInfo()
							that.selectedRowKeys = [];
						})
					},
					onCancel() {}
				})
			},
			// 获取货源信息
			getSupplyInfo(params = {}) {
				this.loading = true
				this.$get('/info/infoCargomaster', {
					pageSize: this.pagination.defaultPageSize,
					pageNum: this.pagination.defaultCurrent,
					cargoTitle: this.cargoTitle
				}).then((r) => {
						console.log(r)
						this.loading = false
						this.data = r.data.data.rows
						this.pagination.total = r.data.data.total
					})
					.catch((e) => {
						console.log(e)
						this.loading = false;
					})
			},
			// 表格排序 分页 筛选事件
			handleTableChange(pagination, filters, sorter) {
				 this.pagination.defaultPageSize = pagination.pageSize
			   this.pagination.defaultCurrent  = pagination.current
			   this.getSupplyInfo()
				// this.getcarSource({
				//   ...this.queryParams
				// })
			}
		}
	}
</script>

<style lang="less" scoped>
</style>